<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>jQuery插件学习</title>
		<script src="jquery-3.6.4.min.js"></script>
		<script src="hc_zoom.js"></script><!-- 放大镜插件 -->
		<!-- 219970720刘莹 -->
		<style>
			/* 放大镜插件 */
			#big{
				display: none;
			}
			#small{
				width: 219.45px;
				height: 292.25px;
			}
			#mypicture{
				float: left;
			}
		</style>
		<script>
			$(function(){
				$("#mypicture").hc_zoom();
			});
		</script>
	</head>
	<body>
		<div id="mypicture"><!-- 放大镜插件使用 -->
			<img src="2.jpg" id="small">
			<img src="2.jpg" id="big"><!-- 877 X 1169 -->
		</div>
	</body>
</html>